<template>
  <div>
<h1>{{[num,person]}}</h1>
<input type="text" v-model.number="obj.tom">
<button @click="handleadd()"> 点击+1</button>

  </div>
</template>

<script setup lang="ts">
import { ref, watch } from 'vue';

const num = ref(15000)
const person = ref(10)



const handleadd = () => {
  num.value++
}
watch([num,person],(val,oldval) => {
  console.log(val,oldval)
})

const obj = ref({
  tom:1,
  rock:2
})

watch(obj,(val,oldval) => {
  console.log(val.tom)
},{
  deep:true
})



watch(()=>obj.value.tom,(val) => {
  console.log('obj对象里面的某个属性发生变化啦',val);
})
</script>

<style scoped></style>
